import React from 'react';

import memo from '../common/wrapMemo';
import { useNavigate } from 'react-router';

import { message } from 'antd';
import api from '../../api';
import style from './Register.module.scss';
import { CloseOutlined } from '@ant-design/icons';
import RegisterForm from './RegisterForm';

const Register = memo(() => {
    const navigate = useNavigate();

    const onFinish = (values) => {
        api.user.register(values).then((res) => {
            const {code} = res.data;
            if(code === 200){
                navigate('/login');
                message.success('已提交注册信息，审核通过后即可登录');
            }else{
                message.error('注册失败，请重新注册');
            }
        });
    };

    const onClose = () => {
        navigate('/login');
    };
    return (
        <>
            <div className={style.register}>
                <div className={style.head}>
                    <span>注册</span>
                    <CloseOutlined onClick={onClose} />
                </div>
                <RegisterForm onFinish={onFinish} btnText="注册" />
            </div>
            <div className={style.mask}></div>
        </>
    );
});

export default Register;
